//canvas api https://www.w3school.com.cn/tags/html_ref_canvas.asp 
//https://www.w3school.com.cn/html5/html5_ref_canvas.asp
// 合并
function mix(图尺寸, 原图, 新图, 新图位置) {
	// 创建画布
	var canvas = document.createElement('canvas');
	var ctx = canvas.getContext("2d");
	var ratio = getPixelRatio(context);
	let width = 图尺寸.width * ratio;
	let height = 图尺寸.height * ratio; //原图.naturalHeight * ratio;
	canvas.width = width;
	canvas.height = height;
	context.rect(0, 0, width, height);
	context.fillStyle = "#fff";
	context.fill();
	let img2width = width / 5;
	let img2height = height / 5;

	// 制作背景图 createPattern 在指定的方向上重复指定的元素
	//var patBg = ctx.createPattern(canvasBg, "repeat");
	// ctx.rect(0, 0, canvas.width, canvas.height);
	// ctx.fillStyle = patBg;
	// ctx.fill();
	left = width - img2width;
	top = height - img2height;
	//context.drawImage(img,x,y,width,height);
	ctx.drawImage(原图, 0, 0, width, height);
	ctx.drawImage(新图, left, top, img2width, img2height);
	// var newImg = new Image();
	// newImg.src = canvas.toDataURL("image/png");
	
}

function qcodeGenert(msg) {
	var qrcode = document.createElement('qrcode');
	var qrcode = new QRCode(qrcode, {
		text: msg,
		width: 128,
		height: 128,
		//colorDark : "#f60",
		//colorLight : "#ccc",
		correctLevel: 0 // 二维码结构复杂性 0~3
	});
	return qrcode;
}

/* 像素密度 如果没这段代码生成的图片可能会模糊,这一块也耽误了很久 */
function getPixelRatio(context) {
	var backingStore = context.backingStorePixelRatio ||
		context.webkitBackingStorePixelRatio ||
		context.mozBackingStorePixelRatio ||
		context.msBackingStorePixelRatio ||
		context.oBackingStorePixelRatio ||
		context.backingStorePixelRatio || 1;
	return (window.devicePixelRatio || 1) / backingStore;
};

//
